import React, { useRef, useState } from "react";

const MyComponent = React.memo(function MyComponent({name}) {
  const [count, setcount] = useState(11110)

  return <><h2>{name}{Date.now()}</h2><button onClick={() => setcount(count+1) }>click {count}</button></>
})

// function MyComponent({name}) {
//   return <h2>{name}{Date.now()}</h2>
// }

const MemoDemo = () => {
  const ref = useRef()
  const [name, setName] = useState('')
  const [count, setcount] = useState(0)
  return ( <>

    <input type='text' ref={ref}/>
    <button onClick={() => setName(ref.current.value) }>click</button>
    <button onClick={() => setcount(count+1) }>click {count}</button>
    <MyComponent name={name}/></> );
}

export default MemoDemo;